<script setup>
import { computed, ref } from 'vue';
import { getDepAllList } from '@/apis/consult';
const query=defineProps({
	type:String,
	illnessType:String
})
//定义高亮下标
const activeIndex=ref(0)
//定义选择科室的响应式数据
const roomList=ref([])
//获取科室列表
	const departmentList=async()=>{
		const res=await getDepAllList()
		console.log(res);
		//获取一级科室
		roomList.value=res.data
	}
	
	//获取二级科室
	const childrenItem=computed(()=>{
		return roomList.value[activeIndex.value]?.child
	})
	
	departmentList()
</script>

<template>
  <view class="department-page">
    <scroll-view scroll-y class="department-primary">
      <view class="department-item" :class="{active:activeIndex===index}" v-for="(item,index) in roomList" :key="item.id" @click="activeIndex=index">{{item.name}}</view>
    </scroll-view>
    <scroll-view class="department-secondary">
      <navigator
        hover-class="none"
        :url="`/subpkg_consult/description/index?type=${query.type}&illnessType=${query.illnessType}&depId=${item.id}`"
        class="department-item"
				v-for="item in childrenItem"
      >
        {{item.name}}
      </navigator>
    </scroll-view>
  </view>
</template>

<style lang="scss">
@import './index.scss';
</style>